/* Gerado a partir de tokens.json. Tema claro = :root; tema escuro = [data-theme="escuro"]. */
:root, [data-theme="claro"] { --teal: #00929e; --laranja: #ff7605; --preto: #1d1d1b; --cinza-azulado: #747c93; --cinza-fita: #969daf; --papel: #f5f5f5; --branco: #ffffff; --fundo: var(--branco); --superficie: var(--papel); --texto: var(--preto); --texto-suave: var(--cinza-azulado); --texto-apagado: #c9ccd6; --linha: var(--cinza-fita); --linha-forte: var(--preto); --assinatura: var(--teal); --sobre-assinatura: var(--branco); --convite: var(--laranja); --sobre-convite: var(--preto); --foco: var(--preto); --postit: rgba(245, 245, 245, 0.94); --fantasma: rgba(29, 29, 27, 0.07); --veu: rgba(29, 29, 27, 0.55); }
[data-theme="escuro"] { color-scheme: dark; --fundo: var(--preto); --superficie: #262624; --texto: var(--branco); --texto-suave: var(--cinza-fita); --texto-apagado: #4a4b52; --linha: var(--cinza-azulado); --linha-forte: var(--branco); --foco: var(--branco); --postit: rgba(245, 245, 245, 0.94); --fantasma: rgba(255, 255, 255, 0.09); --veu: rgba(29, 29, 27, 0.55); }
:root { --esp-1: 4px; --esp-2: 8px; --esp-3: 12px; --esp-4: 16px; --esp-5: 24px; --esp-6: 32px; --esp-7: 48px; --esp-8: 64px; --esp-9: 96px; --esp-10: 128px; --esp-11: 192px; --margem-lateral: 32px; --coluna-texto: 640px; --raio-0: 0px; --raio-postit: 2px; --raio-card: 20px; --raio-pilula: 999px; --sombra-postit: 0 18px 40px rgba(29, 29, 27, 0.22); --sombra-menu: 0 12px 32px rgba(29, 29, 27, 0.24); --dur-micro: 160ms; --dur-ui: 240ms; --dur-revelar: 700ms; --dur-abertura: 1100ms; --dur-faixa: 40s; --dur-selo: 24s; --atraso-escada: 90ms; --curva-saida: cubic-bezier(0.22, 1, 0.36, 1); --curva-entrada-saida: cubic-bezier(0.65, 0, 0.35, 1); --curva-mola: cubic-bezier(0.34, 1.56, 0.64, 1); --font-display: "Gotham", "Montserrat", "Helvetica Neue", Arial, sans-serif; --font-texto: "Montserrat", "Helvetica Neue", Arial, sans-serif; --font-assinatura: "Baloo Bhaina 2", "Montserrat", sans-serif; }